import React, { memo } from 'react';
import PropTypes from 'prop-types';

import {
  AlbumWrapper
} from "./style";


const YYAlbumCover = memo(function HYAlbumCover(props) {
  const { info, size = "100px", width = "118px", bgp = "-570px" } = props;

  const getSizeImage = (imgUrl, size) => `${imgUrl}?param=${size}x${size}`;

  return (
    <AlbumWrapper size={size} width={width} bgp={bgp}>
      <div className="album-image">
        <img src={getSizeImage(info.picUrl, 150)} alt={info.company} />
        <a href="/abc" className="cover sprite_covor">{info.name}</a>
      </div>
      <div className="album-info">
        <div className="name">{info.name}</div>
        <div className="artist">{info.artist.name}</div>
      </div>
    </AlbumWrapper>
  );
});

YYAlbumCover.propTypes = {
  info: PropTypes.object,
  size: PropTypes.string,
  width: PropTypes.string,
  bgp: PropTypes.string
};

YYAlbumCover.defaultProps = {
  info: {},
};
export default YYAlbumCover;